<template>
    <div>
        <table border="1" width="80%">
            <thead>
                <h1>商品管理</h1>
                <tr>
                    <td>id</td>
                    <td>名称</td>
                    <td>数量</td>
                    <td>单价</td>
                    <td>操作</td>
                </tr>
            </thead>
            <tbody>
                <tr v-for="(item) in xuanr" :key="item.id">
                    <td>{{ item.id }}</td>
                    <td>{{ item.mc }}</td>
                    <td>{{ item.sl }}</td>
                    <td>{{ item.dj }}</td>
                    <td>删除</td>
                </tr>
            </tbody>
        </table>
        <fyq :as="Math.ceil(datas.length / ts)" @asd="sf"></fyq>
    </div>
</template>
  
<script>
export default {
    data() {
        return {
            datas:
                [{ id: 1, mc: "手机", sl: 10, dj: 10 },
                { id: 2, mc: "手机", sl: 10, dj: 10 },
                { id: 3, mc: "手机", sl: 10, dj: 10 },
                { id: 4, mc: "手机", sl: 10, dj: 10 },
                { id: 5, mc: "手机", sl: 10, dj: 10 },
                { id: 6, mc: "手机", sl: 10, dj: 10 }],
            xuanr: "",
            ts: 5
        }
    },
    methods: {
        sf(val) {
            this.xuanr = this.datas.slice((val - 1) * this.ts, val * this.ts)
        }
    }
}
</script>
  
<style scoped></style>